<template>
    <div class="an-order-box">
      <card >
        <div slot="header" class="head clearfix">
          <div class="an-left">王家店</div>
          <div class="an-right"><span class="color-org">待付款</span></div>
        </div>
        <div slot="content" class="card-padding">
          <img-text></img-text>
          <div class="total">
            共1件商品，合计：<span class="money">￥899</span>.00
          </div>
        </div>
        <div slot="footer" class="foot clearfix">
          <div class="an-left">
            <a style="color:#909399">更多</a>
          </div>
          <div class="an-right">
            <x-button mini plain class="an-border-radius">取消订单</x-button>
            <x-button mini plain type="warn" class="an-border-radius">立即付款</x-button>
          </div>
        </div>
      </card>
    </div>
</template>

<script>
  import { Card,XButton  } from 'vux'
  import imgText from '@/components/imgTex'
  export default {
      name: "order-car",
      components: {
        Card,
        XButton,
        imgText,
      }
    }
</script>

<style lang="less" scoped>
.an-order-box{
  .head{
    padding: 8px 15px;
  }
  .total{
    padding: 5px 15px;
    text-align: right;
    .money{
      font-size: 18px;
    }
  }
  .foot{
    padding: 10px 15px;
    .weui-btn + .weui-btn{
      margin: 0;
    }
  }
}
</style>
